Next.js 是基于 React 的框架，它提供了一个简单的构建工具，可以让你快速构建一个网站。

安装

前置条件：安装 Node.js、npm

npm init -y
npm install next react react-dom

# + "next": "^12.1.6",
# + "react": "^18.1.0",
# + "react-dom": "^18.1.0"

{
  "dependencies": {
    "next": "^12.1.6",
    "react": "^18.1.0",
    "react-dom": "^18.1.0"
  },
  "name": "demo",
  "version": "1.0.0",
  "main": "index.js",
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "pfan",
  "license": "ISC",
  "description": ""
}

添加build和start命令

{
  "dependencies": {
    "next": "^12.1.6",
    "react": "^18.1.0",
    "react-dom": "^18.1.0"
  },
  "name": "demo",
  "version": "1.0.0",
  "main": "index.js",
  "devDependencies": {},
  "scripts": {
    "build": "next build",
    "start": "next start"
  },
  "author": "pfan",
  "license": "ISC",
  "description": ""
}

创建pages目录

mkdir pages && cd pages && touch index.js

function HomePage() {
  return <div>Welcome to Next.js!</div>
}

export default HomePage

启动服务

npm run dev

#npm run dev --port=8888
#
#> demo@1.0.0 dev
#> next dev
#
#ready - started server on 0.0.0.0:3000, url: http://localhost:3000